import { Modal } from 'antd';
import isFunction from 'lodash/isFunction';
import { WeaLocaleProvider } from 'ecCom';
import { createReplyBottomAtt, replaceFun } from '../../../util/CoworkUtil';

const getLabel = WeaLocaleProvider.getLabel;

class CommentItem extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    const {
      discussantInfo = {},
      remark,
      showDate,
      commentuserInfo,
      id,
      canReply,
    } = this.props;
    const { op_isComCanDelete, op_isComCanReply } = this.props;
    const {
      relatedaccList4E9 = [],
      relatedcusList4E9 = [],
      relateddocList4E9 = [],
      relatedprjList4E9 = [],
      relatedwfList4E9 = [],
      relatemutilprjs4E9 = [],
    } = this.props;
    return (
      <div className="wea-cowork-comment-item">
        <div>
          <div>
            <div className="cowork-reply-content">
              <div>
                <span className="cowork-reply-user">
                  {discussantInfo.anonymous ? (
                    <span>{discussantInfo.lastname}</span>
                  ) : (
                    <a
                      href={`javaScript:openhrm(${discussantInfo.id});`}
                      onClick={window.pointerXY}
                    >
                      {discussantInfo.lastname}
                    </a>
                  )}
                  {commentuserInfo && commentuserInfo.id && (
                    <span>
                      <span className="ml5">{getLabel(128123, '回复')}</span>
                      {commentuserInfo.anonymous ? (
                        <span className="ml5">{commentuserInfo.lastname}</span>
                      ) : (
                        <a
                          className="ml5"
                          href={`javaScript:openhrm(${commentuserInfo.id});`}
                          onClick={window.pointerXY}
                        >
                          {commentuserInfo.lastname}
                        </a>
                      )}
                    </span>
                  )}
                  <span className="reply-time">{showDate}</span>
                </span>
                <span className="fr">
                  {op_isComCanDelete == 1 && (
                    <span
                      className="cowork-top-icon icon-coms-delete"
                      onClick={this.delete}
                      title={getLabel(91, '删除')}
                    />
                  )}
                  {op_isComCanReply == 1 && canReply && (
                    <span
                      className="cowork-top-icon icon-coms-New-SMS"
                      onClick={() =>
                        this.props.reply(id, discussantInfo.lastname)
                      }
                      title={getLabel(128123, '回复')}
                    />
                  )}
                </span>
              </div>
              <div className="cowork-reply-remark wea-f12">
                <div
                  className="wea-cl-content"
                  dangerouslySetInnerHTML={{
                    __html: `<div class="wea-ckeditor-content">${replaceFun(
                      remark,
                    )}</div>`,
                  }}
                />
              </div>
              <div>
                {createReplyBottomAtt(
                  'icon-portal-content-o',
                  getLabel(857, '相关文档'),
                  relateddocList4E9,
                )}
                {createReplyBottomAtt(
                  'icon-portal-Workflow-o',
                  getLabel(1044, '相关流程'),
                  relatedwfList4E9,
                )}
                {createReplyBottomAtt(
                  'icon-portal-crm-o',
                  getLabel(783, '相关客户'),
                  relatedcusList4E9,
                )}
                {createReplyBottomAtt(
                  'icon-portal-project',
                  getLabel(782, '相关项目'),
                  relatemutilprjs4E9,
                )}
                {createReplyBottomAtt(
                  'icon-coms-Approval-o',
                  getLabel(33414, '相关任务'),
                  relatedprjList4E9,
                )}
                {createReplyBottomAtt(
                  'icon-coms-currency-Enclosure',
                  getLabel(22194, '相关附件'),
                  relatedaccList4E9,
                  true,
                )}
              </div>
            </div>
          </div>
        </div>
      </div>
    );
  }

  delete = () => {
    let that = this;
    Modal.confirm({
      content: getLabel(4903, '确认要删除该评论', 'note'),
      onOk() {
        isFunction(that.props.operate) &&
          that.props.operate({
            id: that.props.id,
            coworkId: that.props.coworkid,
            operationType: 'delComment',
            discussId: that.props.topdiscussid,
          });
      },
    });
  };
}

export default CommentItem;
